웹개발 및 최신 테크 소식을 전하는 블로그, 웹이즈프리
상황에 따라 태그에 사용자 임의의 속성을 넣고 싶을때가 있죠. class나 id값을 사용하기도 하지만 data가 많거나 복잡하면 다른 방법을 찾아야합니다.
자주 사용되는 예는 게시판에 번호나 특정 style을 부여하려는 경우입니다. 사용자 속성의 경우 속성 이름을 짓는데 제한은 없지만 W3C의 권고사항으로 "data-" 형의 이름을 사용하면 좋죠.
data-user="..." //user와 관련된 속성을 넣을 경우
data-product="..." //product와 관련된 속성을 넣을 경우
아래의 글도 찾고 계시지 않나요?
canvas 태그 배우기. 장단점과 멀티 레이어 및 이미지 추출 방법
HTML data 속성에 접근하는 dataset API 알아보기- [자바스크립트] 상위 태그 및 부모 태그 제거하기, strip parent tag
React에서 string, 텍스트, 문자열로 html 코드를 추가하는 방법- [HTML5] 캔버스 영역을 자바스크립트를 사용하여 base64로 저장하기
- [HTML5] Video 태그 사용 방법 및 예제 정리
- 자바 템플릿 타임리프(thymeleaf)에서 html 파일 추가하는 방법 및 예제
HTML form태그를 사용하여 입력폼 만들기 및 예제
[HTML5] Canvas 태그에 투명도 opacity 적용하기- VueJS 라우팅 설정시 # 기호 제거하기, hashbang